import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
//引入登陆页面
import Login from '@/views/Login'
//引入文章列表页面
import ArticleList from '@/views/ArticleList'
//引入文章列表页面
import PublishArticle from '@/views/PublishArticle'
//引入政治网页面（轮播图）
import politicsPage from '@/views/politicsPage'
// 引入评论页面
import text from '@/views/text'
import keepAliveA from '@/views/keepAliveA'
// 阻止单击事件继续传播页面
import stop from '@/views/stop'
// 插槽
import slotChild from '@/views/slot/slotChild'
import slotPrent from '@/views/slot/slotPrent'

// 二维码
import QRCode from '@/views/QRCode'
// 头像页面
import bwa from '@/views/bwa'
// 音乐组件
import music from '@/views/music'
import musicA from '@/views/musicA'
import musicB from '@/views/musicB'
// 选择组件
import selectPage from '@/views/selectList'
// keepAlive
import keepAliveB from '@/views/keepAliveB'
// signature_pad签名
import signaturePad from '@/views/signaturePad'

// element
//回到顶部
import backtop from '@/views/element/Backtop'
//form表单
import Pagination from '@/views/element/Pagination'
//$attrs+$listeners
import attrsListeners from '@/views/attrs+listeners/a1'
Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    meta: {
      breadcrumb: '首页'
    },
    // 嵌套子路由,在页面对应地方加入 router-view 标签就行
    children: [
      {
        path: '/ArticleList',
        name: 'ArticleListPage',
        component: ArticleList,
        // meta是个对象,matched是个数组
        meta: {
          breadcrumb: '文章列表'
        }
      },
      {
        path: '/PublishArticle',
        name: 'PublishArticlePage',
        component: PublishArticle,
        meta: {
          breadcrumb: '发布文章'
        }
      },
    ]
  },
  //登陆页面路由
  {
    path: '/login',
    name: 'loginpage',
    component: Login
  },
  // 测试评论页
  {
    path: '/text',
    name: 'textpage',
    component: text
  },
  // 测试keep-Alive缓存
  {
    path: '/keepAliveA',
    name: 'keepAliveA',
    // component: keepAliveA,
    component:resolve => require(['@/views/keepAliveA'], resolve),
    meta: {
      keepAlive: true  
    }
  }, 
  {
    path: '/keepAliveB',
    name: 'keepAliveB',
    // component: keepAliveB
    component:()=>import("@/views/keepAliveB")
  },
  // 阻止单击事件继续传播
  {
    path: '/stop',
    name: 'stop',
    // component: stop
    component:resolve => require(['@/views/stop'], resolve)
  },
  // 音乐
  {
    path: '/music',
    name: 'music',
    component: music
  },
  // 音乐A
  {
    path: '/musicA',
    name: 'musicA',
    // component: musicA
    component:resolve => require(['@/views/musicA'], resolve)
  },
  // 音乐B
  // {
  //   path: '/musicB',
  //   name: 'musicB',
  //   component: musicB
  // },

  {
    path: '/slotChild',
    name: 'slotChild',
    component: slotChild
  },
  {
    path: '/slotPrent',
    name: 'slotPrent',
    component: slotPrent
  },
  // {
  //   path: '/bwa',
  //   name: 'bwa',
  //   component: bwa
  // },
  {
    path: '/QRCode',
    name: 'QRCode',
    component: QRCode
  },

  {
    path: '/signaturePad',
    name: 'signaturePad',
    component: signaturePad
  },
  
  {
    path: '/selectPage',
    name: 'selectPage',
    component: selectPage
  },
  {
    path: '/politicsPage',
    name: 'politicsPage',
    component: politicsPage
  },
  {
    path: '/needLoad',
    name: 'needLoad',
    component: ()=>import('@/views/needLoad'),
    // component:resolve => require(['@/views/needLoad'], resolve)
  },
  {
    path: '/backtop',
    name: 'backtop',
    component: backtop
  },
  {
    path: '/Pagination',
    name: 'Pagination',
    component: Pagination
  },
  // $attrs+$listeners
  {
    path: '/attrsListeners',
    name: 'attrsListeners',
    component: attrsListeners,
    meta: {
      data: {
        id: 1,
        name: 'John'
      }
    }
  }
]

const router = new VueRouter({
  routes
})

export default router
